<%--
  Created by IntelliJ IDEA.
  User: KING
  Date: 2021/1/26
  Time: 17:06
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>后台管理</title>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/manager.css"/>
    <script src=" webjars/jquery/3.5.1/jquery.js"></script>
    <script type="text/javascript">
        $(function(){
            $(".hosp_title").click(function(){
                $(".menu1").slideToggle("slow");
                if($(".pick1").text() == "▼"){
                    $(".pick1").text("▶");
                }else{
                    $(".pick1").text("▼");
                }
                $(".msg").css("display","none");
            });

            $(".doc_title").click(function(){
                $(".menu2").slideToggle("slow");
                if($(".pick2").text() == "▼"){
                    $(".pick2").text("▶");
                }else{
                    $(".pick2").text("▼");
                }
                $(".msg").css("display","none");
            });

            $(".rost_title").click(function(){
                $(".menu3").slideToggle("slow");
                if($(".pick3").text() == "▼"){
                    $(".pick3").text("▶");
                }else{
                    $(".pick3").text("▼");
                }
                $(".msg").css("display","none");
            });

            /* 显示药品 */
            $(".medicine_title").click(function(){
                $(".menu4").slideToggle("slow");
                if($(".pick4").text() == "▼"){
                    $(".pick4").text("▶");
                }else{
                    $(".pick4").text("▼");
                }
                $(".msg").css("display","none");
            });

            /* 显示医院类型管理页面 */
            $(".hosp_type").click(function(){
                $(".msg").css("display","none");
                $(".hospital_manager").css("display","block");
                $(".titText").css("font-weight","400");
                $(this).css("font-weight","600");
            })

            /* 显示医院介绍页面 */
            $(".hosp_msg").click(function(){
                $(".msg").css("display","none");
                $(".intr_info").css("display","block");
                $(".titText").css("font-weight","400");
                $(this).css("font-weight","600");
            })

            /* 显示科室管理页面 */
            $(".hosp_dept").click(function(){
                $(".msg").css("display","none");
                $(".dept_manager").css("display","block");
                $(".titText").css("font-weight","400");
                $(this).css("font-weight","600");
            })

            /* 显示医生类别页面 */
            $(".doc_type").click(function(){
                $(".msg").css("display","none");
                $(".docType_manager").css("display","block");
                $(".titText").css("font-weight","400");
                $(this).css("font-weight","600");
            })

            /* 显示医生信息页面 */
            $(".doc_msg").click(function(){
                $(".msg").css("display","none");
                $(".doc_Info").css("display","block");
                $(".titText").css("font-weight","400");
                $(this).css("font-weight","600");
            })

            /* 显示排班页面 */
            $(".rost_exp").click(function(){
                $(".msg").css("display","none");
                $(".doc_duty").css("display","block");
                $(".titText").css("font-weight","400");
                $(this).css("font-weight","600");
            })
            /* 显示药品列表 */
            $(".medicine_msg").click(function(){
                $(".msg").css("display","none");
                $(".medicine_Info").css("display","block");
                $(".titText").css("font-weight","400");
                $(this).css("font-weight","600");
            })
            /* 显示药品类型 */
            $(".medicine_tp").click(function(){
                $(".msg").css("display","none");
                $(".medicine_type").css("display","block");
                $(".titText").css("font-weight","400");
                $(this).css("font-weight","600");
            })

            /* 添加 */
            // 隐藏、显示弹框
            $(".insertBtn").click(function() {
                $(".addrow").toggle();
            });

            /* 修改 */
            // 隐藏、显示弹框
            $(".updateBtn").click(function() {
                $(".addrow").toggle();
            });

            // 点击除按钮和弹框之外任意地方隐藏弹窗
            $("body").click(function (e) {
                if (!$(e.target).closest(".insertBtn,.addrow,.updateBtn").length) {
                    $(".addrow").hide();
                }
            });

            /* 提交 */
            $(".addrow_submit").click(function(){
                $(".addrow").hide();
            })

            /* 取消 */
            $(".addrow_reset").click(function(){
                $(".addrow").hide();
            })

            /* 添加医院简介 */
            $(".insertIntrBtn").click(function() {
                $(".addInfo").toggle();
            });

            // 点击除按钮和弹框之外任意地方隐藏弹窗
            $("body").click(function (e) {
                if (!$(e.target).closest(".insertIntrBtn,.addInfo,.updateIntrBtn").length) {
                    $(".addInfo").hide();
                }
            });

            /* 修改医院简介 */
            $(".updateIntrBtn").click(function() {
                $(".addInfo").toggle();
            });

            /* 新增医生信息 */
            $(".docInsert").click(function() {
                $(".addmsg").toggle();
            });

            // 点击除按钮和弹框之外任意地方隐藏弹窗
            $("body").click(function (e) {
                if (!$(e.target).closest(".docInsert,.addmsg,.docUpdate").length) {
                    $(".addmsg").hide();
                }
            });

            /* 修改医生信息 */
            $(".docUpdate").click(function() {
                $(".addmsg").toggle();
            });

            /* 添加排班信息 */
            $(".scheInsert").click(function() {
                $(".sche_info").toggle();
            });

            // 点击除按钮和弹框之外任意地方隐藏弹窗
            $("body").click(function (e) {
                if (!$(e.target).closest(".scheInsert,.sche_infoUl,sche_tab,.scheUpdate").length) {
                    $(".sche_info").hide();
                }
            });

            /* 修改医生信息 */
            $(".scheUpdate").click(function() {
                $(".sche_info").toggle();
            });

            /* 添加药品 */
            $(".medInsert").click(function() {
                $(".addmedicine").toggle();
            });
            $("body").click(function (e) {
                if (!$(e.target).closest(".addmedicine").length) {
                    $(".addmedicine").hide();
                }
            });

        })
    </script>
</head>
<body>
<div class="outpatient">
    <!-- 页面头部 -->
    <div class="outpatient-top">
        <h1>后台管理</h1>
        <div class="current-time">
            2017年8月16日 11时15分55秒
        </div>
        <div class="operator">
            操作人:
            <span>振华</span>
        </div>
    </div>
    <hr >


    <!-- 左边列表 -->
    <div class="left_list">
        <div class="list1">
            <span class="hosp_title"><span class="pick1">▼</span> 医院管理</span>

            <div class="menu1">
                <a href="javascript:void(0)" class="hosp_type titText">医院类型管理</a><br>
                <a href="javascript:void(0)" class="hosp_msg titText">医院介绍</a><br>
                <a href="javascript:void(0)" class="hosp_dept titText">科室管理</a><br>
            </div>
        </div>

        <div class="list2">
            <span class="doc_title"><span class="pick2">▼</span> 医生管理</span>

            <div class="menu2">
                <a href="javascript:void(0)" class="doc_type titText">医生类别管理</a><br>
                <a href="javascript:void(0)" class="doc_msg titText">医生信息</a><br>
            </div>
        </div>

        <div class="list3">
            <span class="rost_title"><span class="pick3">▼</span> 排号管理</span>

            <div class="menu3">
                <a href="javascript:void(0)" class="rost_exp titText">专家值班排号</a><br>
            </div>
        </div>

        <div class = "list4">
            <span class="medicine_title"><span class="pick4">▼</span> 药品管理</span>

            <div class="menu4">
                <a href="javascript:void(0)" class="medicine_tp titText">药品类型管理</a><br>
                <a href="javascript:void(0)" class="medicine_msg titText">药品管理</a><br>
            </div>
        </div>
    </div>

    <!-- 右边部分 -- 医院部分 -->
    <div class="right_msg">

        <!-- 医院类型管理 -->
        <div class="hospital_manager msg">
            <span class="hospital_title titl">医院类型管理</span>

            <button type="button" class="btn insert_hospital insertBtn addBtn">添加</button>
            <button type="button" class="btn update_hospital updateBtn modBtn">修改</button>
            <button type="button" class="btn delete_hospital delBtn">删除</button>
            <button type="button" class="btn enable_hospital enaBtn">启用</button>
            <button type="button" class="btn disable_hospital disBtn">禁用</button>

            <input type="text" name="hospital_input" class="hospital_input sel" placeholder="医院类型"/>
            <button type="button" class="btn select_hospital selBtn">查询类型</button>

            <table class="hospital_tab">
                <tr>
                    <th>序号</th>
                    <th>类型名称</th>
                    <th>创建时间</th>
                    <th>创建人</th>
                    <th>修改时间</th>
                    <th>修改人</th>
                    <th>状态</th>
                </tr>
                <tr>
                    <td>
                        <input type="checkbox" name="" />1
                    </td>
                    <td>妇幼保健</td>
                    <td>2020</td>
                    <td>张三</td>
                    <td>2020</td>
                    <td>李四</td>
                    <td>在职</td>
                </tr>
                <tr>
                    <td>
                        <input type="checkbox" name="" />2
                    </td>
                    <td>妇幼保健</td>
                    <td>2020</td>
                    <td>张三</td>
                    <td>2020</td>
                    <td>李四</td>
                    <td>在职</td>
                </tr>
            </table>
        </div>

        <!-- 医院介绍 -->
        <div class="intr_info msg">
            <span class="intr_title titl">医院简介</span>

            <button type="button" class="btn insert_intr insertIntrBtn addBtn">添加</button>
            <button type="button" class="btn update_intr updateIntrBtn modBtn">修改</button>
            <button type="button" class="btn delete_intr delBtn">删除</button>
            <button type="button" class="btn enable_intr enaBtn">启用</button>
            <button type="button" class="btn disable_intr disBtn">禁用</button>

            <input type="text" name="intr_input" class="intr_input sel" placeholder="医院名"/>
            <button type="button" class="btn select_intr  selBtn">查询医院</button>

            <table class="intr_tab">
                <tr>
                    <th>医院logo</th>
                    <th>创建时间</th>
                    <th>负责人</th>
                    <th>简介</th>
                </tr>
                <tr>
                    <td>这里是图片</td>
                    <td>2020</td>
                    <td>张三</td>
                    <td>
                        北京协和医院是集医疗、教学、科研于一体的大型三级甲等综合医院,是国家卫生计生委指定的全国疑难重症诊治指导中心,也是最早承担高干保健
                    </td>
                </tr>
            </table>
        </div>

        <!-- 科室管理 -->
        <div class="dept_manager msg">
            <span class="dept_title titl">科室管理</span>

            <button type="button" class="btn insert_dept insertBtn addBtn">添加</button>
            <button type="button" class="btn update_dept updateBtn modBtn">修改</button>
            <button type="button" class="btn delete_dept delBtn">删除</button>
            <button type="button" class="btn enable_dept enaBtn">启用</button>
            <button type="button" class="btn disable_dept disBtn">禁用</button>

            <input type="text" name="dept_input" class="dept_input sel" placeholder="科室名"/>
            <button type="button" class="btn select_dept selBtn">查询科室</button>

            <table class="dept_tab">
                <tr>
                    <th>序号</th>
                    <th>科室名称</th>
                    <th>创建时间</th>
                    <th>创建人</th>
                    <th>修改时间</th>
                    <th>修改人</th>
                    <th>状态</th>
                </tr>
                <tr>
                    <td>
                        <input type="checkbox" name="" />1
                    </td>
                    <td>外科</td>
                    <td>2018</td>
                    <td>啊啊啊</td>
                    <td>2020</td>
                    <td>哇哇哇</td>
                    <td>正常</td>
                </tr>
                <tr>
                    <td>
                        <input type="checkbox" name="" />2
                    </td>
                    <td>内科</td>
                    <td>20118</td>
                    <td>啊啊啊</td>
                    <td>2020</td>
                    <td>哇哇哇</td>
                    <td>停用</td>
                </tr>
            </table>
        </div>

        <!-- 医生类别管理 -->
        <div class="docType_manager msg">
            <span class="docType_title titl">医生类别管理</span>

            <button type="button" class="btn insert_docType insertBtn addBtn">添加</button>
            <button type="button" class="btn update_docType updateBtn modBtn">修改</button>
            <button type="button" class="btn delete_docType delBtn">删除</button>
            <button type="button" class="btn enable_docType enaBtn">启用</button>
            <button type="button" class="btn disable_docType disBtn">禁用</button>

            <input type="text" name="" class="docType_input sel" placeholder="医生类别"/>
            <button type="button" class="btn select_docType selBtn">查询类别</button>

            <table class="docType_tab">
                <tr>
                    <th>序号</th>
                    <th>类别名称</th>
                    <th>创建时间</th>
                    <th>创建人</th>
                    <th>修改时间</th>
                    <th>修改人</th>
                    <th>状态</th>
                </tr>
                <tr>
                    <td>
                        <input type="checkbox" name="" />1
                    </td>
                    <td>外科医生</td>
                    <td>2019</td>
                    <td>屁屁屁</td>
                    <td>2020</td>
                    <td>冲冲冲</td>
                    <td>在职</td>
                </tr>
                <tr>
                    <td>
                        <input type="checkbox" name="" />2
                    </td>
                    <td>内科医生</td>
                    <td>2019</td>
                    <td>屁屁屁</td>
                    <td>2020</td>
                    <td>冲冲冲</td>
                    <td>在职</td>
                </tr>
            </table>
        </div>

        <!-- 医生信息 -->
        <div class="doc_Info msg">
            <span class="docInfo_title titl">医生信息</span>

            <button type="button" class="btn insert_docInfo docInsert addBtn">添加</button>
            <button type="button" class="btn update_docInfo docUpdate modBtn">修改</button>
            <button type="button" class="btn delete_docInfo delBtn">删除</button>
            <button type="button" class="btn enable_docInfo enaBtn">启用</button>
            <button type="button" class="btn disable_docInfo disBtn">禁用</button>

            <input type="text" name="" class="docInfo_input sel" placeholder="医生类别"/>
            <button type="button" class="btn select_docInfo selBtn">查询类别</button>

            <table class="docInfo_tab">
                <tr>
                    <th>序号</th>
                    <th>医生姓名</th>
                    <th>电话</th>
                    <th>邮箱</th>
                    <th>性别</th>
                    <th>年龄</th>
                    <th>状态</th>
                </tr>
                <tr>
                    <td>
                        <input type="checkbox" name="" />1
                    </td>
                    <td>张三</td>
                    <td>12315</td>
                    <td>123@321.com</td>
                    <td>男</td>
                    <td>25</td>
                    <td>在职</td>
                </tr>
                <tr>
                    <td>
                        <input type="checkbox" name="" />2
                    </td>
                    <td>李四</td>
                    <td>12315</td>
                    <td>123@321.com</td>
                    <td>男</td>
                    <td>25</td>
                    <td>在职</td>
                </tr>
            </table>
        </div>

        <!-- 药品管理 -->
        <div class="medicine_Info msg" style="display: none;">
            <span class="docInfo_title titl">药品信息</span>

            <button type="button" class="btn insert_medInfo medInsert addBtn">添加</button>
            <button type="button" class="btn update_medInfo medUpdate modBtn">修改</button>
            <button type="button" class="btn delete_medInfo delBtn">删除</button>
            <table class="medInfo_tab">
                <tr>
                    <th>序号</th>
                    <th>药品名称</th>
                    <th>价格</th>
                    <th>类型</th>
                    <th>厂家</th>
                    <th>数量</th>
                </tr>
                <tr>
                    <td>
                        <input type="checkbox" name="" />1
                    </td>
                    <td>阿司匹林</td>
                    <td>22.9</td>
                    <td>退烧</td>
                    <td>xxxxx厂家</td>
                    <td>100</td>
                </tr>
                <tr>
                    <td>
                        <input type="checkbox" name="" />2
                    </td>
                    <td>麦滋林</td>
                    <td>24.9</td>
                    <td>胃药</td>
                    <td>xxxxx厂家</td>
                    <td>100</td>
                </tr>
            </table>
        </div>
        <div class="medicine_type msg" style="display: none;">
            <span class="docInfo_title titl">药品类型管理</span>

            <button type="button" class="btn insert_docInfo docInsert addBtn">添加</button>
            <button type="button" class="btn update_docInfo docUpdate modBtn">修改</button>
            <button type="button" class="btn delete_docInfo delBtn">删除</button>
            <table class="docInfo_tab">
                <tr>
                    <th>序号</th>
                    <th>类型名称</th>
                </tr>
                <tr>
                    <td>
                        <input type="checkbox" name="" />1
                    </td>
                    <td>退烧</td>
                </tr>
                <tr>
                    <td>
                        <input type="checkbox" name="" />2
                    </td>
                    <td>胃药</td>
                </tr>
            </table>
        </div>

        <!-- 专家值班排号 -->
        <div class="doc_duty msg">

            <span class="sche_title titl">医生信息</span>

            <button type="button" class="btn insert_sche scheInsert addBtn">添加</button>
            <button type="button" class="btn update_sche scheUpdate modBtn">修改</button>
            <button type="button" class="btn delete_sche delBtn">删除</button>
            <button type="button" class="btn enable_sche enaBtn">启用</button>
            <button type="button" class="btn disable_sche disBtn">禁用</button>

            <input type="text" name="" class="sche_input sel" placeholder="医生类别"/>
            <button type="button" class="btn select_sche selBtn">查询类别</button>

            <table class="dutyTab">
                <tr>
                    <th></th>
                    <th>内科</th>
                    <th>外科</th>
                    <th>耳鼻喉科</th>
                    <th>眼科</th>
                </tr>
                <tr>
                    <td>星期一</td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td>星期二</td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td>星期三</td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td>星期四</td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td>星期五</td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td>星期六</td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td>星期日</td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
            </table>
        </div>

        <!-- 添加修改 -->
        <div class="addrow">
            <ul class="addrowUl1">
                <li>类型名称 <input type="text" class="typeName" placeholder="请输入类型名称"/></li>
                <li>创建人 <input type="text" class="addPerson" placeholder="请输入创建人"/></li>
                <li>创建时间 <input type="date" class="addDate"/></li>
            </ul>
            <ul class="addrowUl2">
                <li>状态 <input type="text" class="status" placeholder="请输入状态"/></li>
                <li>修改人 <input type="text" class="updatePerson" placeholder="请输入修改人"/></li>
                <li>修改时间 <input type="date" class="updateTime"/></li>
            </ul>

            <button type="button" class="addrow_submit">提交</button>
            <button type="button" class="addrow_reset">取消</button>
        </div>

        <!-- 添加医院介绍 -->
        <div class="addInfo">
            <ul class="addInfoUl1">
                <li>医院logo:</li>
                <li>医院名称</li>
                <li>医院类型</li>
                <li>创建时间:</li>
                <li>负责人:</li>
                <li>医院简介:</li>
            </ul>
            <ul class="addInfoUl2">
                <li><input type="file" class="addInfologo"/></li>
                <li><input type="text" class="addInfoName"/></li>
                <li><select name="">
                    <option value="">1</option>
                    <option value="">2</option>
                    <option value="">3</option>
                </select></li>
                <li><input type="date" class="addInfoDate" /></li>
                <li><input type="text" class="addInfoPerson" /></li>
                <li><textarea></textarea></li>
            </ul>

            <button type="button" class="addInfo_submit">提交</button>
            <button type="button" class="addInfo_reset">取消</button>
        </div>

        <!-- 添加医生信息 -->
        <div class="addmsg">
            <ul class="addmsgUl1">
                <li>医生姓名: <input type="text" class="docName" placeholder="请输入姓名"/></li>
                <li class="docSex">
                    性别:
                    <input type="radio" name="sex" value="" checked/>男
                    <span>
								<input type="radio" name="sex" value=""/>女
							</span>
                </li>
                <li>年龄: <input type="text" class="docAge" placeholder="请输入年龄"/></li>
            </ul>
            <ul class="addmsgUl2">
                <li>电话: <input type="tel" class="docTel" placeholder="请输入电话"/></li>
                <li>邮箱: <input type="email" class="docEmail" placeholder="请输入邮箱"/></li>
                <li>状态:
                    <select class="docStatus" name="">
                        <option value="">在职</option>
                        <option value="">离职</option>
                    </select>
                </li>
            </ul>

            <button type="button" class="doc_submit">提交</button>
            <button type="button" class="doc_reset">取消</button>

        </div>

        <!-- 添加排班信息-->
        <div class="sche_info">
            <ul class="sche_infoUl">
                <li>
                    星期：
                    <select name="">
                        <option value="">星期一</option>
                        <option value="">星期二</option>
                        <option value="">星期三</option>
                        <option value="">星期四</option>
                        <option value="">星期五</option>
                        <option value="">星期六</option>
                        <option value="">星期七</option>
                    </select>
                </li>
                <li>
                    <!-- 遍历所有科室 -->
                    科室：
                    <select name="">
                        <option value="">科室1</option>
                        <option value="">科室2</option>
                        <option value="">科室3</option>
                        <option value="">科室4</option>
                    </select>
                </li>
            </ul>
            <!-- 遍历改科室所有医生 -->
            <table class="sche_tab">
                <tr>
                    <th>序号</th>
                    <th>医生姓名</th>
                    <th>电话</th>
                    <th>邮箱</th>
                    <th>性别</th>
                    <th>年龄</th>
                    <th>状态</th>
                </tr>
                <tr>
                    <td>
                        <input type="checkbox" name="" />1
                    </td>
                    <td>李四</td>
                    <td>12315</td>
                    <td>123@321.com</td>
                    <td>男</td>
                    <td>25</td>
                    <td>在职</td>
                </tr>
            </table>

            <button type="button" class="sche_submit">添加</button>
            <button type="button" class="sche_reset">撤消</button>

        </div>
        <!-- 添加药品 -->
        <div class="addmedicine" >
            <div class="med-div">
                <ul class="addmedUl1">
                    <li>名称 <input type="text" class="medicineName" placeholder="名称"/></li>
                    <li>价格 <input type="text" class="medicinePrice" placeholder="价格"/></li>
                    <li>类型 ：
                        <select class="docStatus" name="">
                            <option value="">退烧</option>
                            <option value="">胃药</option>
                        </select>
                    </li>
                </ul>
                <ul class="addmedUl2">
                    <li>厂家 <input type="text" class="typeName" placeholder="请输入厂家"/></li>
                    <li>数量 <input type="text" class="addPerson" placeholder="数量"/></li>
                </ul>
                <button type="button" class="addmed_submit">提交</button>
                <button type="button" class="addmed_reset">取消</button>
            </div>
        </div>
        <!-- 修改药品 -->
        <div class="Updatamedicine" style="display: none;">
            <div class="med-div">
                <ul class="UpdatamedUl1">
                    <li>名称 <input type="text" class="medUpdataName" placeholder="名称"/></li>
                    <li>价格 <input type="text" class="medUpdataPrice" placeholder="价格"/></li>
                    <li>类型 ：
                        <select class="docStatus" name="">
                            <option value="">退烧</option>
                            <option value="">胃药</option>
                        </select>
                    </li>
                </ul>
                <ul class="UpdatamedUl2">
                    <li>厂家 <input type="text" class="UpdatatypeName" placeholder="请输入厂家"/></li>
                    <li>数量 <input type="text" class="UpdataPerson" placeholder="数量"/></li>
                </ul>
                <button type="button" class="addmed_submit">提交</button>
                <button type="button" class="addmed_reset">取消</button>
            </div>
        </div>


    </div>
</div>
</body>
</html>

